<!DOCTYPE html>
<html>
  <head>
    <title><%= news_title(@episode) %></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="color-scheme" content="light dark">
    <meta name="supported-color-schemes" content="light dark only">
    <meta name="copyright" content="Changelog Media LLC">
    <meta name="author" content={List.first(@episode.hosts, %{name: "Jerod Santo"}).name}>
    <meta name="description" property="og:description" content={html_escape(@episode.title)}>

    <meta property="og:type" content="website">
    <meta property="og:title" content={news_title(@episode)}>
    <meta property="og:site_name" content="Changelog News">
    <meta property="og:url" content={url(~p"/#{@episode.podcast.slug}/#{@episode.slug}")}>
    <meta property="og:locale" content="en_US">
    <meta property="og:image" content={url(~p"/images/share/twitter-news.png")}>

    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:site" content="@Changelog">
    <meta name="twitter:description" content={html_escape(@episode.title)}>
    <meta name="twitter:url" content={url(~p"/#{@episode.podcast.slug}/#{@episode.slug}")}>
    <meta name="twitter:image" content={url(~p"/images/share/twitter-news.png")}>

    <meta name="apple-itunes-app" content={"app-id" <> PodcastView.apple_id(@episode.podcast)}>

    <link rel="stylesheet" href={url(~p"/css/email.css")}>
    <link rel="shortcut icon" href={url(~p"/favicon.ico")}>
  </head>
  <body>
    <p style="display:none !important;"><%= @episode.email_teaser %></p>
    <table width="100%" cellpadding="0" cellspacing="0" border="0">
      <tbody>
        <tr>
          <td width="100%">
            <table width="700" cellpadding="0" cellspacing="0" border="0" align="center">
              <tbody>
                <tr>
                  <td width="700">
                  <%= if @person do %>
                    <table width="700" cellpadding="0" cellspacing="0" border="0">
                      <tbody>
                        <tr>
                          <td class="header" align="center">
                            <img class="spacer-10" src={url(~p"/images/email/spacer_1.gif")}>
                            <p class="last-of-type"><%= link("View on Web", to: url(~p"/#{@episode.podcast.slug}/#{@episode.slug}"), title: "View this newsletter in your web browser") %>
                              &nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;&nbsp;
                              <%= link("Audio Edition", to: EpisodeView.audio_url(@episode), title: "Direct link to the audio") %>
                              &nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;&nbsp;
                              <%= link("Changelog++", to: url(~p"/++"), title: "It's better!") %>
                            </p>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  <% end %>
                    <table width="700" cellpadding="35" cellspacing="0" border="0">
                      <tbody>
                        <tr>
                          <td>
                            <div class="content">
                              <%=
                              @episode.email_content
                              |> SharedHelpers.md_to_html()
                              |> HtmlKit.put_utm_source("changelog-news")
                              |> HtmlKit.put_img_width("630")
                              |> raw() %>
                            </div>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  <%= if @person do %>
                    <img class="spacer-20" src={url(~p"/images/email/spacer_1.gif")}>
                    <table width="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="#e5e5e5">
                      <tbody>
                        <tr><td bgcolor="#e5e5e5" height="1" width="100%"></td></tr>
                      </tbody>
                    </table>
                    <table width="700" cellpadding="20" cellspacing="0" border="0">
                      <tbody>
                        <tr>
                          <td class="footer" align="center">
                            <img class="spacer-20" src={url(~p"/images/email/spacer_1.gif")}>

                            <p><%= link("Unsubscribe", to: PersonView.opt_out_url(@person, "podcast", @episode.podcast.slug)) %></p>
                          <%= if String.length(@subscription.context) > 0 do %>
                            <p>(Context: <%= @subscription.context %>)</p>
                          <% end %>
                            <p class="last-of-type">Copyright Changelog Media LLC</p>
                            <img class="spacer-20" src={url(~p"/images/email/spacer_1.gif")}>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                    <% end %>
                  </td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
  </body>
</html>
